<%@ page contentType="text/html; charset=UTF-8"%>
<%@ include file="/jsp/taglib.jsp"%>
<!DOCTYPE html>
<html>
<head>

	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>jqGird</title>
	<meta name="keywords" content="">
	<meta name="description" content="">

	<link rel="shortcut icon" href="favicon.ico">
	<link href="${ctxStatic}/plugins/h+/css/bootstrap.min14ed.css?v=3.3.6" rel="stylesheet">
	<link href="${ctxStatic}/plugins/h+/css/font-awesome.min93e3.css?v=4.4.0" rel="stylesheet">
	<link href="${ctxStatic}/plugins/h+/css/plugins/bootstrap-table/bootstrap-table.min.css" rel="stylesheet">
	<link href="${ctxStatic}/plugins/h+/css/animate.min.css" rel="stylesheet">
	<link href="${ctxStatic}/plugins/h+/css/style.min862f.css?v=4.1.0" rel="stylesheet">
	<link rel="stylesheet" type="text/css" href="${ctxStatic}/plugins/h+/css/plugins/webuploader/webuploader.css">
	<link href="${ctxStatic}/plugins/h+/css/plugins/sweetalert/sweetalert.css" rel="stylesheet">
	<style>
		.ml10 {
			margin-left: 15px;
		}

	</style>

</head>

<body class="gray-bg" >
<div class="wrapper wrapper-content" id="ccbb">
	<div class="row">
		<div class="col-sm-12">
			<div class="toolbar">
				<%--<div id="toolbar">--%>
					<%--<button id="btn_doBack" class="btn btn-w-s btn-edit"><i class="fa fa-times-circle"></i>&nbsp;批量退回</button>--%>
				<%--</div>--%>
			</div>
			<span id="spancc" class="spancc"></span>
			<div class="row">
				<div class="ibox float-e-margins">
					<div class="ibox-title">
						<h5>搜索条件</h5>
						<div class="ibox-tools">
							<a class="collapse-link">
								<i class="fa fa-chevron-up"></i>
							</a>
						</div>
					</div>
					<div class="ibox-content" >
						<div class="row">
							<div class="col-md-2"><input placeholder="昵称" id="search_person" class="form-control"/></div>
							<div class="col-md-2"><input placeholder="手机号" id="search_phone" class="form-control"/></div>
							<div class="col-md-2">
								<select class="select2 form-control"  id="search_isGet">
									<option value="">请选择</option>
									<option value="0">未中奖</option>
									<option value="1">已中奖</option>
								</select>
							</div>
							<div class="col-md-1"><button id="btn_search" class="btn btn-primary"><i class="fa fa-search"></i>&nbsp;搜索</button></div>
						</div>
					</div>
				</div>
			</div>
			<table id="exampleTablePagination"></table>
		</div>
	</div>
</div>

</body>
<script src="${ctxStatic}/plugins/h+/js/jquery.min.js?v=2.1.4"></script>
<script src="${ctxStatic}/plugins/h+/js/bootstrap.min.js?v=3.3.6"></script>
<script src="${ctxStatic}/plugins/h+/js/plugins/bootstrap-table-master/bootstrap-table.js"></script>
<script src="${ctxStatic}/plugins/h+/js/plugins/bootstrap-table/bootstrap-table-mobile.min.js"></script>
<script src="${ctxStatic}/plugins/h+/js/plugins/bootstrap-table-master/locale/bootstrap-table-zh-CN.js"></script>
<script src="${ctxStatic}/plugins/h+/js/plugins/bootstrap-table-master/extensions/export/bootstrap-table-export.js"></script>
<script src="${ctxStatic}/plugins/h+/js/plugins/bootstrap-table-master/extensions/editable/bootstrap-table-editable.js"></script>
<script src="${ctxStatic}/plugins/h+/js/plugins/sweetalert/sweetalert.min.js"></script>
<script src="${ctxStatic}/plugins/h+/js/content.min.js?v=1.0.0"></script>
<script src="${ctxStatic}/plugins/h+/js/plugins/layer/laydate/laydate.js"></script>
<script>

</script>
<script type="text/javascript" src="http://tajs.qq.com/stats?sId=9051096" charset="UTF-8"></script>
<script type="text/javascript">
	var ajaxpath='${pageContext.request.contextPath}';
	//初始化表格对象
	var $table = $('#exampleTablePagination');
	/*
	 获取选中行的相关数据
	 */
	$(function () {
		$table.on('click-row.bs.table', function (e, row, $element) {
			$('.success').removeClass('success');
			$($element).addClass('success');
		});
		$('#button').click(function () {
			alert('Selected name: ' + getSelectedRow().customer);
		});
	});
	function getSelectedRow() {
		var index = $table.find('tr.success').data('index');
		return $table.bootstrapTable('getData')[index];
	}





	////////////////////////////////////////////////////////////////////////////////////////以下是通过js方式初始化BootStrapTable/////////////////////////////////////////////

	$table.bootstrapTable({
		url: ajaxpath+"/mebactivity/showMebActivityPerson.ac",
		method: 'post',
		contentType: "application/x-www-form-urlencoded",//必须的
		dataType: "json",
		pageList:[10, 20, 50, 100],//会根据当前的数据量加载合适的pageList
		height: ($(window).height()-200) ,
		//cardView:true,//是否自适应手机
		pagination: true, //分页
		// queryParamsType: "limit",
		singleSelect: false,
		cache:false,
		sortName:"name",
		search: false, //显示搜索框
		showColumns:false,
		showRefresh:false,
		showToggle:false,
		showPaginationSwitch:false,
		smartDisplay:true,
		detailView:false,
		toolbar:"#toolbar",
		queryParams: queryParams,//参数
		searchOnEnterKey:true,
		detailFormatter:function(index, row, element){
			return row.customer;
		},
		sidePagination: "server", //服务端处理分页
		columns: [
			{
				visible:false,
				field:'id'
			},
            {
                title:'选择',
                align:'center',
//                formatter:stateFormatter,
                checkbox:true
            },
			{
				title: '昵称',
				field: 'person_name',
				sortStable:true,
				align: 'center'
			},
			{
				title: '手机号',
				field: 'phone',
				sortStable:true,
				align: 'center'
			},
			{
				title: '报名时间',
				field: 'createTime',
				sortStable:true,
				align: 'center'
			},{
                title: '是否中奖',
                field: 'isGet',
                sortStable:true,
                align: 'center' ,
                formatter:function(value,row,index) {
                    if (value == '0') {
                        return  '未中奖';
                    }else{
                        return '已中奖';
                    }
                }
            },
		]
	});

	/*
	 搜索按钮
	 */
	$("#btn_search").click(function(){
		$table.bootstrapTable('selectPage', 1);
		$table.bootstrapTable('refresh', queryParams);
	})

	/*
	 传递的参数
	 */
	function queryParams(params) {
		var person=$("#search_person").val();
		var phone=$("#search_phone").val();
		var isGet=$("#search_isGet").val();
		var temp = {  //这里的键的名字和控制器的变量名必须一直，这边改动，控制器也需要改成一样的
			limit: params.limit,  //页面大小
			offset: params.offset, //页码
			pageindex:params.pageNumber,
            person: person,
            phone: phone,
			id:'${id}',
			isGet:isGet
		};
		return temp;
	};





	/**
	 * js截取字符串，中英文都能用
	 * @param str：需要截取的字符串
	 * @param len: 需要截取的长度
	 */
	function cutstr(str, len) {
		var str_length = 0;
		var str_len = 0;
		str_cut = new String();
		str_len = str.length;
		for (var i = 0; i < str_len; i++) {
			a = str.charAt(i);
			str_length++;
			if (escape(a).length > 4) {
				//中文字符的长度经编码之后大于4
				str_length++;
			}
			str_cut = str_cut.concat(a);
			if (str_length >= len) {
				str_cut = str_cut.concat("...");
				return str_cut;
			}
		}
		//如果给定字符串小于指定长度，则返回源字符串；
		if (str_length < len) {
			return str;
		}
	}

    function  doBack(id,state,isGrand) {
        if(isGrand=='0'&&state=='0'){
            doBackList(id);
        }else{
            alert("该实体卡无法退回！");
        }
    }


    function  doBackList(id) {
        $.ajax({
            url: ajaxpath+'/offlineCard/doBackList.ac?id='+id.toString(),// 跳转到 action
            type: 'post',
            cache: false,
            dataType: 'json',
            success: function (data) {
                if(data=='1'){
                    alert("退回成功！", null);
                    $table.bootstrapTable('selectPage', 1);
                    $table.bootstrapTable('refresh', queryParams);
                }else{
                    alert("无效的实体卡！", null);
                }
            },
            error: function () {
                alert("操作失败！");
            }
        });
    }

    //批量退回
    $("#btn_doBack").click(function(){
        var id=getSelections();
        doBackList(id);
    });

    function getSelections() {
        return $.map($table.bootstrapTable('getSelections'), function (row) {
            return row.id;
        });
    }

    //撤回
	function  doCancelCard(id,state) {
		if(state=='1'){
			doCancelCardList(id);
		}else{
		    alert("不符合撤回条件，无法撤回");
		}
    }

    function doCancelCardList(id) {
        $.ajax({
            url: ajaxpath+'/offlineCard/doCancelCardList.ac?id='+id.toString(),// 跳转到 action
            type: 'post',
            cache: false,
            dataType: 'json',
            success: function (data) {
                if(data.flag=='0'){
                    alert("撤回成功！", null);
                    $table.bootstrapTable('selectPage', 1);
                    $table.bootstrapTable('refresh', queryParams);
                }else{
                    alert(data.msg, null);
                }
            },
            error: function () {
                alert("操作失败！");
            }
        });
    }

</script>

</html>
